<!DOCTYPE html>
<html class="x-admin-sm" xmlns:th="http://www.thymeleaf.org" >
    <head>
        <meta charset="UTF-8">
        <title>欢迎页面-X-admin2.2</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
        <link rel="stylesheet" th:href="@{/static/css/font.css}" >
        <link rel="stylesheet" th:href="@{/static/css/xadmin.css}" >
        <script th:src="@{/static/layui/layui.js}"  charset="utf-8"></script>
        <script type="text/javascript" th:src="@{/static/js/xadmin.js}" ></script>
        <script type="text/javascript" th:src="@{/static/js/common.js}" charset="UTF-8" ></script>
        <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
        <!--[if lt IE 9]>
        <script th:src="@{/static/js/html5.min.js}" charset="UTF-8" src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
        <script th:src="@{/static/js/respond.min.js}" charset="UTF-8" src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
        <![endif]-->
    </head>
    <body>
        <div class="layui-fluid">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-header">基本信息
                            <span style="float: right;margin-right: 10px;" >
                                <button type="button" onclick="openConfig()" class="layui-btn layui-btn-fluid">
                                    <i class="layui-icon">&#xe642;</i>配置
                                </button>
                            </span>
                        </div>
                        <div class="layui-card-body ">

                        </div>
                    </div>
                </div>
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-header">日志信息汇总
                        </div>
                        <div class="layui-card-body ">
                            <table class="layui-hide" id="test" lay-filter="test" ></table>
                        </div>
                    </div>
                </div>

                <style id="welcome_style"></style>
        </div>
        </div>
        <script type="text/html" id="toolbarDemo">
            <div class="layui-input-inline layui-show-xs-block">
                <button class="layui-btn layui-btn-sm" lay-event="addLock"><i class="layui-icon">&#xe608;</i> 批量新增卡密</button>
               <button class="layui-btn layui-btn-sm" lay-event="importLock"><i class="layui-icon">&#xe60a;</i> 导入卡密</button>
                <!--                 <button class="layui-btn layui-btn-sm" lay-event="getCheckData">查看日志明细</button>
                                <button class="layui-btn layui-btn-sm" lay-event="taskData">重跑错误数据</button>
                                <button class="layui-btn layui-btn-sm" lay-event="stop">暂停</button>
                                <button class="layui-btn layui-btn-sm" lay-event="reboot">重启</button>-->
				<button class="layui-btn layui-btn-sm" lay-event="update">刷新列表</button>
            </div>
            <div class="layui-input-inline layui-show-xs-block">
                <input type="text" name="value" id="value" placeholder="卡密内容" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-input-inline layui-show-xs-block">
                <button class="layui-btn" lay-filter="sreach" lay-event="sreach" >
                    <i class="layui-icon">&#xe615;</i></button>
            </div>
        </script>
        <script type="text/html" id="barDemo">
            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
        </script>
        <script th:inline="javascript">
            var ctx = [[@{/}]]
            var type = /*[[${type}]]*/    //获取model中的值
        </script>
        <script th:inline="none">

            function openConfig(){
                //自适应宽高
                xadmin.open(ifType(type) + '配置',ctx + 'config/' + type);
            }

            layui.use('table', function(){
                var table = layui.table,
                    $ = layui.jquery;
                //第一个实例
                table.render({
                    elem: '#test'
                    // ,height: 'full-20'
                    ,toolbar: '#toolbarDemo' //开启头部工具栏，并为其绑定左侧模板
                    ,defaultToolbar: ['filter', 'exports', 'print', { //自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
                        title: '提示'
                        ,layEvent: 'LAYTABLE_TIPS'
                        ,icon: 'layui-icon-tips'
                    }]
                    ,url: ctx + 'camilleList?' //数据接口
                    ,loading: true
                    ,page: true //开启分页
                    ,response: {
                        statusCode: 200 //规定成功的状态码，默认：0
                        ,countName: 'total' //规定数据总数的字段名称，默认：count
                    },request: {
                        limitName: 'size' //每页数据量的参数名，默认：limit
                    }
                    ,cols: [[ //表头
                        {type: 'radio', fixed: 'left', title: '选择'}
                        ,{field: 'id', title: 'ID', sort: true, hide : true}
                        ,{field: 'name', title: '卡密名称', width:150}
                        ,{field: 'value', title: '卡密内容'}
                        ,{field: 'createTime', title: '创建时间',sort: true}
                        ,{field: 'remark', title: '备注'}
                        ,{fixed: 'right', title:'操作', toolbar: '#barDemo', width:150}
                    ]]
                });


                //头工具栏事件
                table.on('toolbar(test)', function(obj){
                    var checkStatus = table.checkStatus(obj.config.id);
                    switch(obj.event){
                        case 'addLock':
                            layer.open({
                                type: 2
                                ,title:"卡密批号增加"
                                ,area: ['50%','80%']
                                ,btnAlign: 'c' //按钮居中
                                ,content: ctx + 'camille/add'
                                ,btn: ['保存', '取消']
                                ,yes: function(index, layero){
                                    //按钮【按钮一】的回调
                                    layer.getChildFrame('body').find('#submit-btn').click();
                                    return;
                                }
                            });
                            //parent.xadmin.add_tab(types+ data[0].performBatch,ctx + 'errorInfo?type='+data[0].type+"&performBatch="+data[0].performBatch, true);
                            break;
                        case 'importLock':
                            layer.open({
                                type: 2
                                ,title:"卡密批号导入"
                                ,area: ['50%','80%']
                                ,btnAlign: 'c' //按钮居中
                                ,content: ctx + 'camille/import'
                                ,btn: ['保存', '取消']
                                ,yes: function(index, layero){
                                    //按钮【按钮一】的回调
                                    layer.getChildFrame('body').find('#submit-btn').click();
                                    return;
                                }
                            });
                            //parent.xadmin.add_tab(types+ data[0].performBatch,ctx + 'errorInfo?type='+data[0].type+"&performBatch="+data[0].performBatch, true);
                            break;
                        case 'update':
                        	table.reload('test');
                            break;
                        case 'addJobTask':
                            // layer.open({
                            //     type: 2
                            //     ,title: ifType(type) + '定时任务配置'
                            //     ,area: ['400px', '380px']
                            //     ,shadeClose: true
                            //     ,content: ctx + "setTimer?type=" + type
                            // });
                            parent.xadmin.add_tab(ifType(type) + "任务定时",ctx + 'timerPage?type=' + type, true);
                            break;
                        //自定义头工具栏右侧图标 - 提示
                        case 'LAYTABLE_TIPS':
                            layer.alert('这是工具栏右侧自定义的一个图标按钮');
                            break;
                        case 'sreach':
                            var map = {}; // Map map = new HashMap();
                            var value = $("#value").val();
                            map["value"] = value; // map.put(key, value);
                            table.reload('test',{
                                where: map
                                ,page: {
                                    curr: 1 //重新从第 1 页开始
                                }
                            });
                            $("#value").val(value);
                            break;
                        //自定义头工具栏右侧图标 - 提示
                        case 'LAYTABLE_TIPS':
                            layer.alert('这是工具栏右侧自定义的一个图标按钮');
                            break;
                    };

                });

                //监听行工具事件
                table.on('tool(test)', function(obj){
                    var data = obj.data;
                    console.log(data)
                    if(obj.event === 'del'){
                        layer.confirm('真的删除行么', function(index){
                            $.get(
                                ctx + "delete" + "?value=" + data.value,
                                function(response) {
                                    //回调函数方法体
                                    layer.msg(response.msg);
                                    if (response.code == 200){
                                        obj.del();
                                    }
                                }
                            )
                            layer.close(index);
                        });
                    }
                });

                //选择行同时选择单选框
                $(document).on("click",".layui-table-body table.layui-table tbody tr", function () {
                    /*当单击表格行时,把单选按钮设为选中状态*/
                    var tableDiv;
                    var index = $(this).attr('data-index');
                    var tableBox = $(this).parents('.layui-table-box');
                    //存在固定列
                    if (tableBox.find(".layui-table-fixed.layui-table-fixed-l").length>0) {
                        tableDiv = tableBox.find(".layui-table-fixed.layui-table-fixed-l");
                    } else {
                        tableDiv = tableBox.find(".layui-table-body.layui-table-main");
                    }
                    var checkCell = tableDiv.find("tr[data-index=" + index + "]").find("td div.layui-table-cell div.layui-form-radio I");
                    if (checkCell.length>0) {
                        checkCell.click();
                    }
                });
                //对td的单击事件进行拦截停止，防止事件冒泡再次触发上述的单击事件  将此代码在页面初始化后执行一次即可以。
                $(document).on("click", "td div.layui-table-cell div.layui-form-radio", function (e) {
                    e.stopPropagation();
                });

            });

        </script>
    </body>
</html>